<style>
<!--
/* the styles for log table...*/
#__magnum_log_wrapper{
    clear:both;
    padding:12px;
    background:#eee;
}

#__magnum_log_wrapper button.__magnum_btn{
    font:9px verdana;
    background:#000;
    color:#fff;
    border:1px solid #ccc;
}

#__magnum_log_wrapper #__magnum_logs{
    border-top:1px dotted #999;
    margin:12px 0;
    padding:12px 0;
    font:12px 'lucida sans', georgia, sans-serif, verdana;
    color:#333;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log{
    width:100%;
    border:2px solid #333;
    text-align:left;
    background:#333;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log th,
#__magnum_log_wrapper #__magnum_logs table#__magnum_log td{
    font:13px 'lucida sans', georgia, sans-serif, verdana;
    background:#fff;
    padding:3px 12px;
    text-align:left;
    color:#333;
    vertical-align:top;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log th{
    font-weight:bold;
    background:#333;
    color:#fff;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log small{
    font-weight:bold;
    color:green;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log th.__magnum_log_group{
    background:#666;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log textarea{
    width:98%;
    height:100px;
    margin:8px;
    padding:4px;
    background:#eee;
    font:12px arial;
    border:1px solid #ccc;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log pre{
    color:#333;
    text-align:left;
    float:none;
}

#__magnum_log_wrapper #__magnum_logs table#__magnum_log tr.__magnum_error td,
#__magnum_log_wrapper #__magnum_logs table#__magnum_log tr.__magnum_error th{
    background:#f00;
    color:#ff0;
    font-weight:bold;
}
-->
</style>
<script type="text/javascript">
<!--
// toggle
function __magnum_toggle(div)
{
    document.getElementById(div).style.display == 'none' ?
        document.getElementById(div).style.display = 'block' : document.getElementById(div).style.display = 'none';
}
-->
</script>
<div id="__magnum_log_wrapper">
    <button class="__magnum_btn" onclick="__magnum_toggle('__magnum_logs')">show log</button>
    <div id="__magnum_logs" style="display: none;">
    <h3>Page generated in <?php echo self::getDuration('core'); ?> second(s).</h3>
    <?php
    if (isset($logs) && is_array($logs)) {
        /**
         * echo '<pre>';
         * var_dump($logs);
         * echo '</pre>';
         */
        /**
         * 'message' => $message,
         * 'class' => $class,
         * 'function' => $func,
         * 'parameters' => $params,
         * 'duration' => $duration
         */
    ?>
    <table id="__magnum_log" cellspacing="0">
    <tr>
        <th>message</th>
        <th>duration</th>
    </tr>
    <?php
        foreach ($logs as $group => $log) {
    ?>
    <tr>
        <th class="__magnum_log_group" colspan="2">
           COMPONENT: <?php echo strtoupper($group); ?>
        </th>
    </tr>
    <?php
        $items = $log->getItems();
        foreach ($items as $key => $item) {
            $id  = md5(serialize(array($key, $item)));
            $item['isError']? $err = '__magnum_error' : $err = null;
    ?>
        <tr class="<?php echo $err; ?>">
            <td>
            <?php if ($item['class'] !== 'N/A') : ?>
            <button style="float: right;" class="__magnum_btn" onclick="__magnum_toggle('<?php echo $id; ?>')">show details</button>
            <?php endif; ?>
            <?php echo $item['message'] ?></td>
            <td><?php echo $item['duration'] ?></td>
        </tr>
        <?php if ($item['class'] !== 'N/A') : ?>
        <tr class="<?php echo $err; ?>">
            <td colspan="2">
                <textarea readonly="readonly" style="display: none;"
                id="<?php echo $id; ?>"><?php echo $item['class'] . '::' . $item['function'] ?>

<?php print_r($item['parameters']); ?></textarea>
            </td>
        </tr>
        <?php endif; ?>
    <?php
        }
    ?>
    <?php
        }
    ?>
    </table>
    <?php
    }
    ?>
    </div>
</div>